<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org" xmlns:shiro="shiro.apache.org/tags">
<head>
    <th:block th:include="common/common_head :: commonHeader('宣告表')"/>
    <link rel="stylesheet" th:href="@{/static/js/plugins/jquery-layout/jquery.layout-latest.css}">
</head>
<body class="gray-bg">
<div class="container-div ui-layout-center">
    <div class="row">
        <div class="col-sm-12 search-condition">
            <form id="declarationForm" th:action="@{/declarationForm/list}" class="form-inline">
                <div class="select-list">
                    <ul>
                        <li class="col-sm-2" style="width: 25%">
                            <label>宣告表号：</label>
                            <input type="text" name="formCode" id="formCode"
                                   autocomplete="off"/>
                        </li>

                        <li class="col-sm-2" style="width: 25%">
                            <label>模块名称：</label>
                            <input type="text" name="materialDesc" id="materialDesc" autocomplete="off"/>
                        </li>

                        <li class="col-sm-2" style="width: 25%">
                            <label>专用号：</label>
                            <input type="text" name="materialCode" id="materialCode" autocomplete="off"/>
                        </li>

                        <li class="col-sm-2" style="width: 25%">
                            <label>关联专用号：</label>
                            <input type="text" name="relateMaterialCode" id="relateMaterialCode"
                                   autocomplete="off"/>
                        </li>

                        <li class="col-sm-2" style="width: 25%">
                            <label>生效状态：</label>
                            <select name="validStatus">
                                <option></option>
                                <option value="0">未生效</option>
                                <option value="1">生效</option>
                                <option value="2">无效</option>
                            </select>
                        </li>

                        <li class="col-sm-2" style="width: 25%">
                            <label>预警状态：</label>
                            <select name="warningStatus">
                                <option></option>
                                <option value="0">正常</option>
                                <option value="1">预警中</option>
                                <option value="2">已超期</option>
                            </select>
                        </li>

                        <li class="col-sm-2" style="width: 25%">
                            <label>宣告日期(起):</label>
                            <input type="text" name="declarationStartDate" id="declarationStartDate"
                                   autocomplete="off"/>
                        </li>
                        <li class="col-sm-2" style="width: 25%">
                            <label>宣告日期(止):</label>
                            <input type="text" name="declarationEndDate" id="declarationEndDate" autocomplete="off"/>
                        </li>
                        <li class="col-sm-2" style="width: 25%">
                            <label>节点状态：</label>
                            <select name="nodeStatus" sysDict="XGBJDZT" emptyFirst="true"></select>
                        </li>

                        <li class="col-sm-2" style="width: 25%">
                            <label>有效日期(起):</label>
                            <input type="text" name="expireStartDate" id="expireStartDate" autocomplete="off"/>
                        </li>

                        <li class="col-sm-2" style="width: 25%">
                            <label>有效日期(止):</label>
                            <input type="text" name="expireEndDate" id="expireEndDate" autocomplete="off"/>
                        </li>


                        <li class="col-sm-2" style="width: 25%">
                            <label>申请审核工厂：</label>
                            <input type="text" name="verifyFactory" autocomplete="off">
                        </li>


                        <li class="col-sm-2" style="width: 25%">
                            <label>校核日期(起):</label>
                            <input type="text" name="reviewStartDate" id="reviewStartDate" autocomplete="off"/>
                        </li>

                        <li class="col-sm-2" style="width: 25%">
                            <label>校核日期(止):</label>
                            <input type="text" name="reviewEndDate" id="reviewEndDate" autocomplete="off"/>
                        </li>

                        <li class="col-sm-2">
                            <button id="declarationSearchBtn" type="button" class="btn btn-primary btn-rounded btn-sm">
                                <i class="fa fa-search"></i>&nbsp;搜索
                            </button>
                            <button class="btn btn-warning btn-rounded btn-sm" type="reset"><i class="fa fa-eraser"></i>&nbsp;重置
                            </button>
                        </li>
                    </ul>
                </div>
            </form>
        </div>

        <div class="col-sm-12 select-info order-table">
            <div class="btn-group hidden-xs toolbar" id="declarationToolBar" role="group">
                <a class="btn btn-outline btn-success btn-rounded" onclick="addForm()"
                   shiro:hasPermission="declarationForm:add">
                    <i class="fa fa-plus"></i> 新增
                </a>
            </div>
            <table id="declaration" data-mobile-responsive="true"></table>
        </div>
    </div>
</div>

<!--shiro不能在js中生效-->
<div id="permissionDiv" style="display: none;">
    <a id="update" class="btn btn-outline btn-success btn-rounded" shiro:hasPermission="declarationForm:audit">审核</a>
</div>


<!--引入公共js-->
<div th:include="common/onload_js :: onloadJS"></div>
<script type="text/javascript" th:src="@{/static/js/plugins/jquery-layout/jquery.layout-latest.js}"></script>

<script type="text/javascript">

    $(function () {
        // 初始化时间插件
        laydate.render({elem: '#reviewEndDate'});
        laydate.render({elem: '#reviewStartDate'});
        laydate.render({elem: '#expireEndDate'});
        laydate.render({elem: '#expireStartDate'});
        laydate.render({elem: '#declarationEndDate'});
        laydate.render({elem: '#declarationStartDate'});

        //初始化所有字典数据
        initDictDataSel();
    });

    var searcherBS = Searcher.createBS('#declaration',
        [
            {title: '宣告表号', field: 'formCode'},
            {title: '专用号', field: 'materialCode'},
            {title: '模块名称', field: 'materialDesc'},
            {title: '宣告日期', field: 'declarationDate'},
            {title: '有效日期', field: 'expireDate'},
            {title: '校核日期', field: 'reviewDate'},
            {title: '申请审核工厂', field: 'verifyFactory'},
            {title: '校核人', field: 'reviewer'},
            {
                title: '节点', field: 'nodeStatus',
                formatter: function (value, row, index) {
                    if (value == 0) {
                        return "厚声待审核";
                    } else if (value == 1) {
                        return "厚声审核通过";
                    } else if (value == 2) {
                        return "厚声审核退回";
                    } else if (value == 3) {
                        return "厚声已淘汰";
                    }
                }
            },
            {
                title: '状态', field: 'validStatus',
                formatter: function (value, row, index) {
                    if (value == 0) {
                        return "未生效";
                    } else if (value == 1) {
                        return "生效";
                    } else if (value == 2) {
                        return "无效";
                    }
                }
            },
            {
                title: '预警状态', field: 'warningStatus',
                formatter: function (value, row, index) {
                    //未生效不需要预警
                    if (row.validStatus == 0) {
                        return;
                    }

                    if (value == 0) {
                        return "正常";
                    } else if (value == 1) {
                        return "预警中";
                    } else if (value == 2) {
                        return "已超期";
                    }
                }
            },
            {title: '关联供货工厂', field: 'relateSupplier'},
            {
                title: "操作", field: '',
                formatter: function (value, row, index) {
                    value= '';
                    if (row.reviewer == undefined || row.reviewer == null || row.reviewer == '') {
                        $("#permissionDiv").find('a').each(function () {
                            $(this).attr("onclick", "audit('" + row.pkId + "')");
                            value += this.outerHTML;
                        })
                        return value;
                    }
                    return '<a class="btn btn-outline btn-success btn-rounded" onclick="func(\'' + row.pkId + '\')">查看</a>';
                }
            }
        ]
    );

    /**
     * 查询数据
     */
    function refresh() {
        searcherBS.refresh();
    }

    /**
     * 关闭模态框
     */
    function closeDialog() {
        layer.closeAll();
    }

    /**
     * 跳转至详情页
     */
    function func(pkId) {
        var index = Dialog.openUrl("详情", ctxPath + '/declarationForm/declarationDetails/'+pkId, {
            area: ['900px', '700px'],
            maxmin: true,
            end: function () {
            }
        });
        layer.full(index);
    }

    /**
     * 添加宣告表
     */
    function addForm() {
        var index = Dialog.openUrl("", ctxPath + '/declarationForm/addDeclarationForm', {
            area: ['900px', '700px'],
            maxmin: true,
        });
        layer.full(index);
    }

    /**
     * 审核
     */
    function audit(id) {
        var index = Dialog.openUrl("审核", ctxPath + '/declarationForm/declarationDetails/' + id, {
            area: ['900px', '700px'],
            maxmin: true
        });
        layer.full(index);
    }

</script>

</body>
</html>